<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE >
<html>
	<head>
		<meta charset="utf-8">
		<title> LOGIN</title>
		<link rel="stylesheet" type="text/css" href="/BhSyCase/css/NewLogin.css" />
		<link rel="stylesheet" type="text/css" href="/BhSyCase/css/font-awesome.css"/>
		
	</head>
	<body >

		<div id="login_box" >
			<h2> Login</h2>

			<div id="form">
				<form action="../UserBhSy/Login" id="login" method="post">
					<div class="input_box">
						<i class="fas fa-user"></i>
						<input type="text" placeholder="Username" id = "zh" name="account">
					</div>
					<span id = "bc_1" style="display: block;color: red;"></span>
					<div class="input_box">
						<i class="fas fa-lock"></i>
						<input type="password" placeholder="Password" id = "pwd" name="pwd">
					</div>
					<span id = "bc_2" style="display: block;color: red;"></span>
					<button id = "btn">Sign in</button>
				</form>
			</div>

			<div id="sign-in">
				<a href="">To register</a>
			</div>
		</div>


	</body>

	<script type="text/javascript">
		window.onload = function(){
			var btn = document.getElementById("btn");
			var zh = document.getElementById("zh");
			var pwd = document.getElementById("pwd");

			var bc_1 = document.getElementById("bc_1");
			var bc_2 = document.getElementById("bc_2");

			var login=document.querySelector("#login");
			login.onsubmit = function(){
				if(zh.value ==""){
					bc_1.innerHTML = "账号不允许为空!";
					return false;
				}else {
					bc_1.style.display="none";
				}
				if(pwd.value == ""){
					bc_2.innerHTML = "密码不允许为空!";
					return false;
				}else{
					bc_2.style.display = "none";
					return true;
				}
			}


		}
	</script>
	
</html>
